<template>
	<view>
		<view class="inpu-form-main">
			<view class="input-item">
				<view class="item-zhang item-form-top" >
					<input  placeholder="输入原手机号" v-model="phone" disabled  />
				</view>
				<view class="item-zhang item-form-top">
						<input type="text" placeholder="输入新手机号" v-model="newPhone"  />
				</view>
				<view class="item-yzm item-form-top" >
						<view class="yzm-left">
									<input type="text" placeholder="输入验证码" maxlength="6" v-model="code" />
						</view>
						<view class="yzm-right " @click="getCode">
								{{time==0?'获取验证码':(time+'s后重新获取')}}
						</view>
				</view>
			</view>
			<view class="form-inputmadin" @click="updatephone">提交</view>
		</view>
	</view>
</template>


<script>
	import * as codeApi from '@/api/code.js'
	import * as userApi from '@/api/user.js'
	export default{
		data(){
			return{
				phone:"",
				newPhone:"",
				code:"",
				time:0,
				interval:null,
			}
		},
		onLoad() {
			
		},
		onShow() {
			this.phone = uni.getStorageSync("userInfo").phone
			if(!this.phone){
					uni.showModal({
						title:"警告！",
						content:"你还没有绑定手机号，先去绑定手机号吧",
						cancelText:"先不绑定",
						confirmText:"去绑定",
						success: (res) => {
							if(res.confirm){
								uni.redirectTo({
									url:"/pages/user/setup/bind_phone"
								})
					
							}else if (res.cancel){
								uni.redirectTo({
									url:"/pages/user/user_item/setting"
								})
							}
						}
					})
			}
		},
		methods:{
			getCode(){
				let _this = this
				if(this.$fxLink.checkPhone(this.newPhone)){
					this.$toast('请输入正确的手机号')
					return
				}
				if (this.time == 0){
					codeApi.sendBindMessage({
						wxapp_id: _this.$wxapp_id,
						mobile:this.newPhone,
					}).then(res => {
						this.$toast(res.msg)
						if(res.code === 1){
							this.time = 60 ;
							this.interval = setInterval(() => {
								if(this.time == 0){
									clearInterval(this.interval)
									return
								}
								this.time --
							},1000)
						}
			
					})
				}
			},
			updatephone(){
				let _this = this
				if(this.$fxLink.checkPhone(this.newPhone)){
					this.$toast('请输入正确的手机号')
					return
				}
				if(!this.code){
					this.$toast('请输入验证码')
					return
				}
				let token = uni.getStorageSync("AccessToken")
				userApi.updatePhone({
					phone:this.newPhone,
					code:this.code,
					token: token
				}).then(res => {
						this.$toast(res.msg)
						if(res.code === 1){
								uni.clearStorageSync()
								if(this.$fxLink.checkBrowser()) {
									setTimeout(() => {
										uni.switchTab({
											url:"/pages/index/index"
										})
									},1000)
								}else{
									setTimeout(() => {
										uni.reLaunch({
											url:"/pages/login/index"
										})
									},1000)
				
								}
						}
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background: #F2F7FA;
	}
</style>